<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
	<meta http-equiv="content-type" content="text/html; charset=utf-8" />
	<title>Tags Creator - Quick Tags</title>
<!--
<script src="http://alexking.org/projects/js-quicktags/demo/js_quicktags.js" type="text/javascript"></script>
var dictionaryUrl = 'http://www.ninjawords.com/';
<script src="http://alexking.org/projects/js-quicktags/demo/js_quicktags.js" type="text/javascript"></script>
http://alexking.org/projects/js-quicktags/demo/index.html
-->
<style>
body{padding:0;margin:0;font:normal 86% Times New Roman, Serif;}
h2{margin:0 20px;padding:0;}
h1{margin:20px 0 0;padding:0;text-align:center;}
textarea{font:normal 96% courier, Courier New, Monospace, Monaco;}

/* start code */

.ed_button{
    font-size:13px;
    font-family:Tahoma;
    font-weight:500;
    color:#aee;text-shadow:1px 1px 1px #000;
    border:2px outset #555;
    border:2px solid #222;
    border-radius:3px;
    margin:3px 0px 0px !important;

background: #828c95;
background: url();
background: -moz-linear-gradient(top, #828c95 0%, #28343b 53%, #828c95 98%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#828c95), color-stop(53%,#28343b), color-stop(98%,#828c95));
background: -webkit-linear-gradient(top, #828c95 0%,#28343b 53%,#828c95 98%);
background: -o-linear-gradient(top, #828c95 0%,#28343b 53%,#828c95 98%);
background: -ms-linear-gradient(top, #828c95 0%,#28343b 53%,#828c95 98%);
background: linear-gradient(to bottom, #828c95 0%,#28343b 53%,#828c95 98%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#828c95', endColorstr='#828c95',GradientType=0 );
    cursor:pointer;
    text-align:center; 
}
#ed_gr_code:nd{display:none;}
input.ed_button:first-of-type{display:none;}
#ed_toolbar_code{margin:0 auto;text-align:center;display:block;}
#ed_b_code,#ed_i_code,#ed_p_code{width:25px;}
#ed_strong_code,#ed_table_code,#ed_scripts_code{width:50px;}
#ed_div_code,#ed_pre_code,#ed_via_code,#ed_link_code{width:35px;}
#ed_gr_code,#ed_bQuote_code{width:57px;color:yellow;}
#ed_code_code,#ed_nobr_code,#ed_span_code,#ed_form_code{width:40px;}
#ed_em_code,#ed_id_code,#ed_ul_code,#ed_ol_code,#ed_li_code,
#ed_h1_code,#ed_h2_code,#ed_h3_code,#ed_h4_code,
#ed_h5_code,#ed_h6_code,#ed_u_code,
#ed_dl_code,#ed_dt_code,#ed_dd_code,#ed_tr_code,
#ed_tr_code,#ed_td_code,#ed_ins_code,#ed_del_code{width:30px;}
#ed_style_code,#ed_footnote_code,#ed_ext_link_code{width:60px;}
#ed_script_code{width:70px;}
#ed_scripts_code,#ed_but_code{width:55px;}
#ed_style_code,#ed_gr_code,#ed_bQuote_code,#ed_script_code,#ed_scripts_code{color:yellow;}
#ed_spell_code{width:44px;color:red;}
.ed_button:active{color:red;}
.ed_button:focus,#ed_gr_code:focus,#ed_bQuote_code:focus{color:red;}

/* start kode */

.ed_button{
    font-size:13px;
    font-family:Tahoma;
    font-weight:500;
    color:#aee;text-shadow:1px 1px 1px #000;
    border:2px outset #555;
    border:2px solid #222;
    border-radius:3px;
    margin:3px 0px 0px !important;

background: #828c95;
background: url();
background: -moz-linear-gradient(top, #828c95 0%, #28343b 53%, #828c95 98%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#828c95), color-stop(53%,#28343b), color-stop(98%,#828c95));
background: -webkit-linear-gradient(top, #828c95 0%,#28343b 53%,#828c95 98%);
background: -o-linear-gradient(top, #828c95 0%,#28343b 53%,#828c95 98%);
background: -ms-linear-gradient(top, #828c95 0%,#28343b 53%,#828c95 98%);
background: linear-gradient(to bottom, #828c95 0%,#28343b 53%,#828c95 98%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#828c95', endColorstr='#828c95',GradientType=0 );
    cursor:pointer;
    text-align:center; 
}
#ed_gr_kode:nd{display:none;}
input.ed_button:first-of-type{display:none;}
#ed_toolbar_kode{margin:0 auto;text-align:center;display:block;}
#ed_b_kode,#ed_i_kode,#ed_p_kode{width:25px;}
#ed_strong_kode,#ed_table_kode,#ed_scripts_kode{width:50px;}
#ed_div_kode,#ed_pre_kode,#ed_via_kode,#ed_link_kode{width:35px;}
#ed_gr_kode,#ed_bQuote_kode{width:57px;color:yellow;}
#ed_code_kode,#ed_nobr_kode,#ed_span_kode,#ed_form_kode{width:40px;}
#ed_em_kode,#ed_id_kode,#ed_ul_kode,#ed_ol_kode,#ed_li_kode,
#ed_h1_kode,#ed_h2_kode,#ed_h3_kode,#ed_h4_kode,
#ed_h5_kode,#ed_h6_kode,#ed_u_kode,
#ed_dl_kode,#ed_dt_kode,#ed_dd_kode,#ed_tr_kode,
#ed_tr_kode,#ed_td_kode,#ed_ins_kode,#ed_del_kode{width:30px;}
#ed_style_kode,#ed_footnote_kode,#ed_ext_link_kode{width:60px;}
#ed_script_kode{width:70px;}
#ed_scripts_kode,#ed_but_kode{width:55px;}
#ed_style_kode,#ed_gr_kode,#ed_bQuote_kode,#ed_script_kode,#ed_scripts_kode{color:yellow;}
#ed_spell_kode{width:44px;color:red;}
.ed_button:active{color:red;}
.ed_button:focus,#ed_gr_kode:focus,#ed_bQuote_kode:focus{color:red;}
</style>


<!--<script src="modif/js/tagsCreator.obus.js" type="text/javascript"></script>-->
<script src="modif/js/tagsCreator_jso.js" type="text/javascript"></script>
</head>
<body>

<h1>Tags Creator - Quick Tags</h1>

<form>
	<fieldset>
		<legend><h2>Example-1</h2></legend>
<div style="width:740px;background:#555;padding:2px 4px 4px;border-radius:6px;margin:10px auto 10px;">
		<script type="text/javascript">grTcW('code');</script>
</div>
		<textarea id="code" rows="7" cols="90" style="display:block;margin:0 auto;"></textarea>
	</fieldset>
	<fieldset>
		<legend><h2>Example-2</h2></legend>
<div style="width:740px;background:#555;padding:2px 4px 4px;border-radius:6px;margin:10px auto 10px;">
		<script type="text/javascript">grTcW('kode');</script>
</div>
		<textarea id="kode" rows="7" cols="90" style="display:block;margin:0 auto;"></textarea>
	</fieldset>
</form>
<style>
#ed_toolbar_canvas{display:block;width:740px;margin:0 auto;padding:0;text-align:center;}
</style>
</body>
</html>